@sheet-bar-btn-size: 24px;

.sheet-bar-btn {
    cursor: pointer;

    display: flex;
    align-items: center;
    justify-content: center;

    width: @sheet-bar-btn-size;
    height: @sheet-bar-btn-size;
    padding: 0;

    font-size: var(--font-size-lg);
    color: rgb(var(--text-color-secondary-darker));

    background-color: transparent;
    border: none;
    border-radius: var(--border-radius-base);
    outline: none;

    &:not([disabled]):hover {
        background-color: rgb(var(--bg-color-hover));
    }

    &[disabled] {
        cursor: not-allowed;
        color: rgb(var(--grey-200));
    }
}
